﻿@{
    ViewBag.Title = "About | Giới thiệu";
    Layout = "~/Views/Shared/_LayoutHome.cshtml";
}

<style type="text/css">
    body {
        font-family: 'Tahoma', sans-serif;
        font-weight: 400;
        font-size: 14px;       
        color: #666;
    }

    ul.about-list {
        margin: 4px 0 0 0;
        padding: 0;
    }

    .about-list li {
        background: url(/Content/Images/about-list.png) no-repeat left top;
        padding-left: 30px;
        margin-bottom: 13px;
        color: #2a282c;
    }

    li:hover {
        color: #1A99CC;
        cursor: pointer;
    }

    blockquote {
        border-left: 4px solid #e7e7e7;
        color: #888;
        line-height: 20px;
        margin: 5px 0 20px;
        padding-left: 20px;
    }

    .show p, pre {
        margin: 0;
        padding: 0 0 15px 0;
    }

    h2.about {
        font-size: 35px;
        color: #1A99CC;
        font-family: 'Roboto Condensed','Lucida Sans Unicode','Lucida Grande',sans-serif;
        padding: 30px 0;
        font-weight: normal;
        line-height: 43px;
        padding: 20px 30px;
    }
</style>

<style type="text/css">
    .container .six.columns {
        width: 340px;       
    }

    .column.omega, .columns.omega {
        margin-right: 0; 
        margin-top: 40px;
    }

    .container .column, .container .columns {
        float: left;
        display: inline;
        margin-left: 10px;
        margin-right: 10px;
    }

    .meter {
        height: 25px;
        position: relative;
        margin: 0 0 15px 0;
        background: #ebebeb;
        width: 340px;
    }

        .meter > span {
            display: block;
            height: 100%;
            background-color: #1A99CC;
        }
</style>

<!-- Script Progress bar animation-->
<script>
    $(function () {
        $(".meter > span").each(function () {
            $(this)
                .data("origWidth", $(this).width())
                .width(0)
                .animate({
                    width: $(this).data("origWidth")
                }, 1200);
        });
    });
</script>

<div class="Shadown_MenuTop"></div>

<ul id="breadcrumbs-one" style="margin: 0 auto">
    <li><a href="/">
        <i class="fa fa-home" style="font-size: 15px"></i>&nbsp;Trang chủ</a>
    </li>
    <li><a class="current">Giới thiệu</a></li>
</ul>

<div class="show">
    <h2 class="about">Làm việc với tất cả nhiệt huyết nhằm mang lại những sản phẩm hoàn hảo nhất, đáp ứng nhu cầu của khách hàng một cách tốt nhất.</h2>
    <div class="_content" style="width: 650px;">
        <div style="padding: 20px">
            <div style="height: 55px">
                <p id="slide-client" class="text"><strong></strong><span></span></p>
                <script type="text/javascript">if (!window.slider) var slider = {}; slider.data = [{ "id": "slide-img-1", "client": "<h4>Chúng tôi là ai?</h4>", "desc": "" }];</script>
            </div>
            <div class="grid_8">
                <p>Là một công ty thiết kế Website chuyên nghiệp, chúng tôi luôn đảm bảo chất lượng sản phẩm cao nhất cho khách hàng với uy tín và kỹ thuật được tích lũy trong hơn 5 năm. Chúng tôi tự tin sẽ giúp quý khách sẽ đạt được hiệu quả cao nhất trong việc quảng bá thương hiệu của công ty.</p>
                <ul class="about-list">
                    <li>Là công ty thiết kế website với ngôn ngữ .NET được lập trình bởi đội ngũ OESTeam với chất lượng cao nhưng chi phí hợp lý nhất.</li>
                    <li>Đội ngũ trẻ trung, năng động và sáng tạo, luôn cập nhật những công nghệ mới nhất.</li>
                    <li>Thiết kế website đáp ứng mọi yêu cầu của khách hàng. Chỉ cần khách hàng có ý tưởng chúng tôi đều có thể thực hiện.</li>
                    <li>Thể hiện vai trò tư vấn của một công ty thiết kế website.</li>
                    <li>Giao diện quản trị thân thiện và chuyên nghiệp, giúp khách hàng cập nhật thông tin lên website của mình một cách dễ dàng nhất.</li>
                    <li>Thiết kế website theo chuẩn nhằm tối ưu tốc độ và SEO (tối ưu hóa bộ máy tìm kiếm).</li>
                    <li>Chúng tôi còn cung cấp các dịch vụ chuyên nghiệp. Tư vấn tận tình, hỗ trợ hết mình, bảo hành có trách nhiệm.</li>
                </ul>
                <blockquote>
                    Chúng tôi không phải là những người giỏi nhất nhưng chắc chắn chúng tôi sẽ làm bạn hài lòng.
                </blockquote>
                <p>Liên hệ ngay với chúng tôi để được tư vấn hoặc <a href="#">xem thêm thông tin về chúng tôi tại đây</a>.</p>
                <div style="text-align: center">
                    <br>
                    <img src="/Content/Images/tech-icon.png">
                </div>
            </div>
        </div>
    </div>

    <div class="_right" style="width: 350px;">
        <div class="six columns omega">
            <p class="margin-btm">Web Design ( 90% )</p>
            <div class="meter">
                <span style="width: 306px;"></span>
            </div>

            <p class="margin-btm">Web Development ( 70% )</p>
            <div class="meter">
                <span style="width: 238px;"></span>
            </div>

            <p class="margin-btm">Brand Identity ( 80% )</p>
            <div class="meter">
                <span style="width: 272px;"></span>
            </div>

            <p class="margin-btm">SEO Optimization ( 60% )</p>
            <div class="meter">
                <span style="width: 204px;"></span>
            </div>
        </div>
    </div>

    <div class="clear"></div>
</div>


